<template>
  <div class="app-container">
    <Find
      :OriginalFilter="{ static: true }"
      :formList="formList1"
      @findClicked="findClicked"
      @Launchform="Launchform"
      @clickNumber="clickNumber"
      @clickNumber1="clickNumber1"
    />

    <el-card v-loading.fullscreen.lock="fullscreenLoading" style="margin-top: 8px" shadow="always" :body-style="{ padding: '10px' }">
      <div style="display: flex">
        <div style="width: 25%">
          <h1>报价型体资料</h1>
          <Table
            :isLoading="isLoading2"
            :tableData="TableQuoteData"
            :tableHeader="tableHeader8"
            :TableHeight="70"
            :outTableHeight="70"
            :selection="true"
            @currentRow="clicktogetdata"
            @selectList="selectList2"
          />
        </div>

        <div style="width: 75%; margin-left: 10px">
          <h1>型体报价资料</h1>
          <Table
            :isLoading="isLoading3"
            :tableData="DisplayTabularData.list"
            :tableHeader="tableHeader9"
            :TableHeight="70"
            :outTableHeight="70"
            :selection="true"
            :summaryData="summaryData"
            summary
            @selectList="selectList"
          />
        </div>
      </div>
      <div style="display: flex">
        <div style="width: 20%">
          <Table
            :isLoading="isLoading3"
            :tableData="DisplayTabularData.maps"
            :summaryData="summaryData1"
            summary
            :tableHeader="tableHeader10"
            :TableHeight="30"
            :outTableHeight="70"
          />
        </div>
        <div style="width: 70%; margin-left: 100px">
          <Table :tableData="HeadertogetdataTable" :tableHeader="tableHeader2" :TableHeight="10.5" :outTableHeight="70" />
        </div>
      </div>
      <PageModule :PageData="{ buttonS: false, pageSizeShow: true }" />
    </el-card>

    <!-- 取型体弹窗 -->
    <el-drawer v-model="drawer" :direction="'ttb'" :before-close="handleClose" size="small" :with-header="false">
      <span @click="drawer = false" style="float: right; cursor: pointer; color: rgb(7, 7, 7)">X</span>
      <Find :OriginalFilter="{ static: true }" :searchImg="false" :formList="formList" @findClicked="findClicked1" @Launchform="Launchform1" />
      <h5 style="font-size: 16px; margin-top: 12px">报价型体资料</h5>
      <span style="color: red">只有返回已建档得数据才可以导入勾选</span>
      <Table
        :isLoading="isLoading4"
        :tableData="GetTypeDataTable?.list"
        :tableHeader="tableHeader7"
        :TableHeight="80"
        :selection="true"
        @selectList="selectList1"
      />
      <PageModule :PageData="PageData" @pageChange="pageChange" @pageSizeChange="pageSizeChange" />
    </el-drawer>

    <!-- 新增报价弹窗 -->
    <el-drawer v-model="drawer1" :direction="'ttb'" :before-close="handleClose1" size="small" :with-header="false">
      <span @click="drawer1 = false" style="float: right; cursor: pointer; color: rgb(7, 7, 7)">X</span>
      <p style="font-size: 18px; margin-top: 12px">+ 新增报价资料</p>
      <Find
        :OriginalFilter="{ static: true }"
        :searchImg="false"
        style="margin-top: 12px"
        :formList="formList2"
        @findClicked="findClicked2"
        @Launchform="Launchform2"
      />
    </el-drawer>
  </div>
</template>
<script lang="ts">
import { defineComponent, ref, onMounted } from 'vue'
import JMessage from '@/utils/JMessage'
export default defineComponent({
  name: 'Samplequotation'
})
</script>
<script lang="ts" setup>
import { i18n, Jzhcn } from '@/i18n'
import {
  checkbox,
  CurrencyData,
  QuoteTypeData,
  TypeFilteringData,
  QuoteTypeDataRight,
  FetchBodyQueryGetData,
  BrandData,
  projecttype,
  TakeTheShapeOfTheBrandConst,
  AddNewQuotes,
  deleteTickData,
  ImportCheck,
  removeTheCheckmark,
  TickToCancelCheck,
  TheNewCurrencyIsDifferent
} from '@/api/GeneralManager/job/SampleQuotationInput'
import type {
  QuoteTypeDatT,
  TypequotesReturnData,
  QuoteTypeDataRightInt,
  QuoteTypeDataRightCT,
  FetchBodyQueryDataT,
  TakeThebodyParameters,
  trademark,
  NewQuotationLnformation,
  TickData,
  removeTheCheck,
  checkParameter
} from '@/api/GeneralManager/job/SampleQuotationInput'
import type { formListType } from '@/components/Find/index.vue'
import { ElMessage } from 'element-plus'
import { ElMessageBox } from 'element-plus'

const isLoading2 = ref(true)
const isLoading3 = ref(true)
const isLoading4 = ref(true)
const isLoading1 = ref(true)

const fullscreenLoading = ref(false)

const TickRecordCheckParms = ref<checkParameter>({
  check: '',
  list: []
})

const TheNewCurrencyIsDifferentParms = ref<any>({
  color: '',
  currency: '',
  mtlProperty: '',
  seqNos: [],
  slipNo: '',
  style: ''
})

const TheNewCurrencyIsDifferentMethods = async () => {
  const result = await TheNewCurrencyIsDifferent(TheNewCurrencyIsDifferentParms.value)
  if (result.code === 200) {
    GetTheQuoteType(GetTheQuoteTyp.value)
    TheNewCurrencyIsDifferentParms.value.seqNos = []
    JMessage.success(result.message)
  } else {
    JMessage.error(result.message)
  }
}

// 打勾记录检核
const TickRecordCheck = async () => {
  const result = await TickToCancelCheck(TickRecordCheckParms.value)
  if (result.code === 200) {
    JMessage.success('打勾记录检核成功')
    QuoteData()
  } else {
    JMessage.error('打勾记录检核失败')
  }
}

// 删除打勾型体
const removeTheCheckm = async () => {
  const result = await removeTheCheckmark(lotNoList2.value)
  if (result.code === 200) {
    QuoteData()
    JMessage.success('删除成功')
  } else {
    JMessage.error(result.message)
  }
}

// 导入勾选函数
const sampleImportCheck = async () => {
  const result = await ImportCheck(lotNoList1.value!)

  if (result.code === 200) {
    fullscreenLoading.value = false
    JMessage.success('导入勾选成功')
    GetTypeData()
    QuoteData()
    return
  } else {
    fullscreenLoading.value = false
    JMessage.error('导入勾选失败请重新导入')
  }
}

const handleClose3 = (_done?: () => void) => {
  ElMessageBox.confirm('确定要删除该数据吗')
    .then(() => {
      TedeleteTickData()
    })
    .catch(() => {})
}

const handleClose4 = (_done?: () => void) => {
  ElMessageBox.confirm('确定要删除该数据吗')
    .then(() => {
      removeTheCheckm()
    })
    .catch(() => {})
}

// 收集删除打勾数据
const deleteArray = ref<TickData>({
  seqNos: [],
  slipNo: '',
  style: ''
})

// 删除打勾数据函数
const TedeleteTickData = async () => {
  const result = await deleteTickData(deleteArray.value as TickData)
  if (result.code === 200) {
    JMessage.success('删除成功')
    GetTheQuoteType(GetTheQuoteTyp.value)
  } else {
    JMessage.error(result.message)
  }
}

const lotNoList2 = ref<removeTheCheck>({
  slipNo: [],
  style: []
})

// 删除打勾型体数据
const selectList2 = (selectedList: any) => {
  lotNoList2.value.slipNo = selectedList.map((item: any) => {
    return item.slipNo
  })

  lotNoList2.value.style = selectedList.map((item: any) => {
    return item.style
  })
  TickRecordCheckParms.value.list = selectedList.map((item: any) => {
    const { style, color, slipNo } = item
    return { style, color, slipNo }
  })
}

// 删除打勾数据
const selectList = (selectedList: any) => {
  let lotNoList: any = []
  lotNoList = selectedList.map((item: any) => {
    return item.seqNo
  })
  const { style, slipNo } = selectedList[0] || {}
  deleteArray.value.seqNos = lotNoList
  deleteArray.value.style = style
  deleteArray.value.slipNo = slipNo

  TheNewCurrencyIsDifferentParms.value.seqNos = selectedList.map((item: any) => {
    return item.seqNo
  })
}

const lotNoList1 = ref<any>({
  quotations: []
})

const selectList1 = (selectedList: any) => {
  lotNoList1.value.quotations = selectedList.map((item: any) => {
    const {
      styleNo,
      styleColor,
      custNo,
      styleName,
      custStyle,
      season,
      shoeSex,
      cutTool,
      lastMode,
      solePart,
      sysUser,
      techPerson,
      baseSize,
      midSize
    } = item || {}

    return {
      styleNo,
      styleColor,
      custNo,
      styleName,
      custStyle,
      season,
      shoeSex,
      cutTool,
      lastMode,
      solePart,
      sysUser,
      techPerson,
      baseSize,
      midSize
    }
  })
  checkboxParms.value = selectedList[length]
  if (selectedList.length !== 0) {
    checkboxMethods()
  }
}

// 添加型体数据
const AddNewQuotationInformation = ref<NewQuotationLnformation>({
  color: '',
  costUsage: '',
  currency: '',
  jgPrice: null,
  mtlColor: '',
  mtlName: '',
  mtlProperty: '',
  mtlSpec: '',
  mtlType: '',
  mtlUnit: '',
  partName: '',
  price: null,
  seqNo: null,
  slipNo: '',
  style: '',
  vendor: ''
})

// 保存添加的型体数据
const SaveTheAddType = async (AddNewQuotationInformation: NewQuotationLnformation) => {
  const result = await AddNewQuotes(AddNewQuotationInformation as NewQuotationLnformation)
  if (result.code === 200) {
    clearFormList3()
    GetTheQuoteType(GetTheQuoteTyp.value)
    fullscreenLoading.value = false
    JMessage.success('添加成功')
  } else {
    JMessage.error(result.message)
  }
}

const formList1 = ref<any[]>([
  {
    type: 'input',
    inputPlaceholder: '请输入型体',
    inputValue: ''
  },
  {
    type: 'select',
    selectValue: '',
    selectP: '品牌',
    selectLabel: '',
    selectOptions: []
  },
  {
    type: 'select',
    selectValue: '',
    selectP: '季度',
    selectLabel: '',
    selectOptions: []
  },
  {
    type: 'date',
    dateLabel: '报价日期',
    dateValue: ''
  },
  {
    type: 'radio',
    checkboxLabel: '我的报价',
    checked: true,
    label: '1'
  },
  {
    type: 'radio',
    checkboxLabel: '所有报价',
    checked: false,
    label: '0'
  },
  {
    type: 'radio1',
    checkboxLabel: '未检核',
    checked: false,
    label: '1'
  },
  {
    type: 'radio1',
    checkboxLabel: '已检核',
    checked: false,
    label: '2'
  },
  {
    type: 'radio1',
    checkboxLabel: '全部',
    checked: true,
    label: '0'
  },
  {
    type: 'button',
    checkboxLabel: '置空',
    bgColor: '#1890FF'
  },
  {
    type: 'button',
    checkboxLabel: '取型体'
  },
  {
    type: 'button',
    checkboxLabel: '打勾型体删除'
  },
  {
    type: 'button',
    checkboxLabel: '打勾记录检核'
  },
  {
    type: 'button',
    checkboxLabel: '打勾取消检核'
  },
  {
    type: 'button',
    checkboxLabel: '参数设定'
  },
  {
    type: 'select',
    selectValue: '',
    selectP: '项目类型筛选',
    selectLabel: '',
    selectOptions: []
  },
  {
    type: 'button',
    checkboxLabel: '打勾材料删除'
  },
  {
    type: 'select',
    selectValue: '',
    selectP: '项目类型',
    selectLabel: '',
    selectOptions: []
  },
  {
    type: 'button',
    checkboxLabel: '更新项目类型'
  },
  {
    type: 'select',
    selectValue: '',
    selectP: '币别',
    selectLabel: '',
    selectOptions: []
  },
  {
    type: 'button',
    checkboxLabel: '更新币别'
  },
  {
    type: 'input',
    inputPlaceholder: '请输入汇率',
    inputValue: ''
  },
  {
    type: 'button',
    checkboxLabel: '更新报价项目'
  },
  {
    type: 'button',
    checkboxLabel: '新增报价材料'
  },
  {
    type: 'button',
    checkboxLabel: '搜索'
  }
])

const formList = ref<any[]>([
  {
    type: 'select',
    selectValue: '',
    selectP: '品牌',
    selectLabel: '',
    selectOptions: []
  },
  {
    type: 'select',
    selectValue: '',
    selectP: '季度',
    selectLabel: '',
    selectOptions: []
  },
  {
    type: 'input',
    inputPlaceholder: '请输入型体',
    inputValue: ''
  },
  {
    type: 'input',
    inputPlaceholder: '请输入鞋名',
    inputValue: ''
  },
  {
    type: 'input',
    inputPlaceholder: '客户型体',
    inputValue: ''
  },
  {
    type: 'button',
    checkboxLabel: '置空',
    bgColor: '#1890FF'
  },
  {
    type: 'button',
    checkboxLabel: '导入勾选'
  }
])

const formList2 = ref<any[]>([
  {
    type: 'input',
    inputPlaceholder: '序号',
    inputValue: ''
  },
  {
    type: 'select',
    selectValue: '',
    selectP: '材料类型',
    selectLabel: '',
    selectOptions: []
  },
  {
    type: 'input',
    inputPlaceholder: '部位',
    inputValue: ''
  },
  {
    type: 'input',
    inputPlaceholder: '材料颜色',
    inputValue: ''
  },
  {
    type: 'input',
    inputPlaceholder: '材料名称',
    inputValue: ''
  },
  {
    type: 'input',
    inputPlaceholder: '供应商',
    inputValue: ''
  },
  {
    type: 'input',
    inputPlaceholder: '规格',
    inputValue: ''
  },
  {
    type: 'input',
    inputPlaceholder: '单位',
    inputValue: ''
  },
  {
    type: 'select',
    selectValue: '',
    selectP: '项目类型',
    selectLabel: '',
    selectOptions: []
  },
  {
    type: 'input',
    inputPlaceholder: '报价单耗',
    inputValue: ''
  },
  {
    type: 'select',
    selectValue: '',
    selectP: '币别',
    selectLabel: '',
    selectOptions: []
  },
  {
    type: 'input',
    inputPlaceholder: '材料单价',
    inputValue: ''
  },
  {
    type: 'input',
    inputPlaceholder: '加工单价',
    inputValue: ''
  },
  {
    type: 'button',
    checkboxLabel: '保存'
  },
  {
    type: 'button',
    checkboxLabel: '置空',
    bgColor: '#1890FF'
  }
])

// 取型体 品牌和季度
const brandsSample = async () => {
  const result = await TakeTheShapeOfTheBrandConst()
  formList.value[0].selectOptions = EvaluatesTheArrayReturnValue(result.brands)
  formList.value[1].selectOptions = EvaluatesTheArrayReturnValue(result.seasons)
}

const EvaluatesTheArrayReturnValue = (ArrayList: any) => {
  return ArrayList.map((item: any, index: any) => {
    return {
      optionKey: index,
      optionValue: item,
      optionLabel: item
    }
  })
}

interface summaryDataType {
  index: number
  num: number | undefined
}

// 计算金额总数
const summaryData = ref<summaryDataType[]>([
  {
    index: 16,
    num: 0
  }
])

const summaryData1 = ref<summaryDataType[]>([
  {
    index: 1,
    num: 0
  }
])

// 项目类型
const projectTypeL = async () => {
  const result = await projecttype()
  projectTypeLP.value = result
  formList1.value[17].selectOptions = EvaluatesTheArrayReturnValue(projectTypeLP.value)
  formList1.value[15].selectOptions = EvaluatesTheArrayReturnValue(projectTypeLP.value)
  formList2.value[8].selectOptions = EvaluatesTheArrayReturnValue(projectTypeLP.value)
}

const projectTypeLP = ref()

// 获取品牌和季度数据
const BrandDataQuarter = async () => {
  const result = await BrandData()
  BrandDataQuarterA.value.brands = result.brands
  BrandDataQuarterA.value.seasons = result.seasons
  formList1.value[1].selectOptions = EvaluatesTheArrayReturnValue(result.brands)
  formList1.value[2].selectOptions = EvaluatesTheArrayReturnValue(result.seasons)
}

const BrandDataQuarterA = ref<trademark>({
  seasons: [],
  brands: []
})

// 单选框数据
const radio1 = ref(1)

const radio2 = ref(0)

// 取型体弹窗
const drawer = ref(false)

// 新增报价材料弹窗
const drawer1 = ref(false)

const handleClose = (done: () => void) => {
  done()
}

const handleClose1 = (done: () => void) => {
  done()
}

// 取型体函数
const sample = () => {
  // 改变弹框的状态
  drawer.value = true

  // 获取 取型体数据
  GetTypeData()
}

// 新增报价材料状态
const sample1 = () => {
  // 改变弹框的状态
  drawer1.value = true
}

// 接口函数
const interAceFunct = () => {
  // 币别
  AcquireCurrency()

  //报价型体资料
  QuoteData()

  //报价资料作业
  TypeFiltering()

  // 项目类型
  projectTypeL()

  // 品牌
  BrandDataQuarter()

  // 获取品牌和季度
  brandsSample()
}

onMounted(() => {
  interAceFunct()
})

// 分页数据
const GetTypeDataTable = ref<FetchBodyQueryDataT>()

const PageData = ref({
  total: 0
})

// 收集数据
const GatherGetTypeData = ref<TakeThebodyParameters>({
  brand: '',
  custStyle: '',
  pageNum: 1,
  pageSize: 40,
  season: '',
  shoeName: '',
  style: ''
})

// 获取型体数据
const GetTypeData = async () => {
  isLoading4.value = true
  const result = await FetchBodyQueryGetData(GatherGetTypeData.value)
  GetTypeDataTable.value = result
  PageData.value.total = result.total
  isLoading4.value = false
}

const pageChange = (val: any) => {
  GatherGetTypeData.value.pageNum = val
  GetTypeData()
}

const pageSizeChange = (val: any) => {
  GatherGetTypeData.value.pageSize = val
  GetTypeData()
}

// 收取币别数据
const AcquireCurren = ref()

// 初始化获取数据
const AcquireCurrency = async () => {
  // 获取币别
  const result = await CurrencyData()

  AcquireCurren.value = result

  formList1.value[19].selectOptions = EvaluatesTheArrayReturnValue(AcquireCurren.value)
  formList2.value[10].selectOptions = EvaluatesTheArrayReturnValue(AcquireCurren.value)
}

// 收集报价型体资料对应的数据
const CollectQuotationData = ref<QuoteTypeDatT>({
  check: Number(radio2.value),
  custom: '',
  endTime: '',
  loginName: '',
  quotation: Number(radio1.value),
  season: '',
  startTime: '',
  style: ''
})

// 报价型体资料表格数据
const TableQuoteData = ref<TypequotesReturnData[]>()

const imgList = ref<any>([])

// 报价型体资料数据
const QuoteData = async () => {
  isLoading2.value = true
  const result = await QuoteTypeData(CollectQuotationData.value)

  TableQuoteData.value = result.list

  if (result.list.length !== 0) {
    TheNewCurrencyIsDifferentParms.value.color = result.list[0].color
    TheNewCurrencyIsDifferentParms.value.style = result.list[0].style
    TheNewCurrencyIsDifferentParms.value.slipNo = result.list[0].slipNo
  }

  imgList.value = result.list.map((item: any) => {
    return item.stylePhoto
  })

  HeadertogetdataTable.value = [] // 清空原数组

  const { slipNo, style, color, ...rest } = result.list[0] || {}

  GetTheQuoteTyp.value.slipNo = slipNo || ''

  GetTheQuoteTyp.value.style = style || ''

  Object.assign(HeadertogetdataTable.value, rest)

  const entriesArray = Object.entries(HeadertogetdataTable.value)

  GetTheQuoteType(GetTheQuoteTyp.value)

  const mergedObject = entriesArray.reduce((result, [key, value]) => {
    return { ...result, [key]: value }
  }, {})

  HeadertogetdataTable.value.push(mergedObject as any) // 将新对象添加到数组中
  AddNewQuotationInformation.value.color = color
  AddNewQuotationInformation.value.slipNo = slipNo
  AddNewQuotationInformation.value.style = style
  result.list.forEach((item) => {
    if (item.check === 'Y') {
      tableHeader8.value[0].backgroundColor = '#3FFF38'
      item.backgroundColor = '#3FFF38'
    }
  })
  isLoading2.value = false
}

// 报价资料作业 - 类型筛选
const TypeFiltering = async () => {
  const result = await TypeFilteringData()

  formList2.value[7].selectOptions = EvaluatesTheArrayReturnValue(result)
}

const GetTheQuoteTyp = ref<QuoteTypeDataRightInt>({
  slipNo: '',
  style: '',
  mtlProperty: ''
})

interface HeadertogetdataTableQ {
  custom: string // 品牌
  season: string // 季度
  styleName: string // 鞋名
  custStyle: string //客人型体
  cutTool: string //冲刀编号
  solePart: string // 大底编号
  lastMold: string // 楦头编号
  sizeRegion: string //码段
  color: string
}

const HeadertogetdataTable = ref<HeadertogetdataTableQ[]>([])

const clicktogetdata = (row: any) => {
  HeadertogetdataTable.value = [] // 清空原数组

  const { slipNo, style, ...rest } = row

  TheNewCurrencyIsDifferentParms.value.color = row.color
  TheNewCurrencyIsDifferentParms.value.style = row.style
  TheNewCurrencyIsDifferentParms.value.slipNo = row.slipNo

  if (GetTheQuoteTyp.value.mtlProperty !== '') {
    GetTheQuoteTyp.value.mtlProperty = ''
  }

  GetTheQuoteTyp.value.slipNo = slipNo
  GetTheQuoteTyp.value.style = style

  Object.assign(HeadertogetdataTable.value, rest)

  const entriesArray = Object.entries(HeadertogetdataTable.value)

  GetTheQuoteType(GetTheQuoteTyp.value)

  const mergedObject = entriesArray.reduce((result, [key, value]) => {
    return { ...result, [key]: value }
  }, {})

  HeadertogetdataTable.value.push(mergedObject as any) // 将新对象添加到数组
  HeadertogetdataTable.value.forEach((item) => {
    AddNewQuotationInformation.value.color = item.color
  })
  AddNewQuotationInformation.value.style = style

  AddNewQuotationInformation.value.slipNo = slipNo
}

const GetTheQuoteType = async (GetTheQuoteTyp: QuoteTypeDataRightInt) => {
  isLoading3.value = true
  const ressult = await QuoteTypeDataRight(GetTheQuoteTyp)
  if (ressult !== null) {
    exchangeRate.value = ressult.rate
    if (ressult.maps) {
      ressult.maps.forEach((item) => {
        if (item.AMT !== '') {
          const floatValue = parseFloat(item.AMT as any)
          item.AMT = floatValue.toFixed(2)
        }
      })
      DisplayTabularData.value = ressult
      summaryData1.value[0].num = ressult.maps.reduce((total, item) => {
        let _index = Number(item.AMT)
        return (total += _index)
      }, 0)
      summaryData.value[0].num = ressult.totalPrice
    }
  }

  isLoading3.value = false
}

// 定义右侧数据点击显示
const DisplayTabularData = ref<QuoteTypeDataRightCT>({
  list: [],
  maps: [],
  rate: 0,
  total: 0,
  totalPrice: 0
})

// 汇率
const exchangeRate = ref<number>()

const tableHeader2 = ref([
  {
    label: '品牌',
    prop: 'custom'
  },
  {
    label: '季度',
    prop: 'season'
  },
  {
    label: '鞋名',
    prop: 'styleName'
  },
  {
    label: '客人型体',
    prop: 'custStyle'
  },
  {
    label: '冲刀编号',
    prop: 'cutTool'
  },
  {
    label: '大底编号',
    prop: 'solePart'
  },
  {
    label: '楦头编号',
    prop: 'lastMold'
  },
  {
    label: '码段',
    prop: 'sizeRegion'
  }
])

const tableHeader7 = ref([
  {
    label: '型体',
    prop: 'styleNo'
  },
  {
    label: '配色',
    prop: 'styleColor'
  },
  {
    label: '品牌',
    prop: 'custNo'
  },
  {
    label: '鞋名',
    prop: 'styleName'
  },
  {
    label: '客户型体',
    prop: 'custStyle'
  },
  {
    label: '季度',
    prop: 'season'
  },
  {
    label: '鞋款性别',
    prop: 'shoeSex'
  },
  {
    label: '冲刀编号',
    prop: 'cutTool'
  },
  {
    label: '楦头编号',
    prop: 'lastMode'
  },
  {
    label: '大底编号',
    prop: 'midUsage'
  },
  {
    label: '开发员',
    prop: 'techPerson'
  },
  {
    label: '核料员',
    prop: 'sysUser'
  },
  {
    label: '基本码',
    prop: 'baseSize'
  },
  {
    label: '中间码',
    prop: 'midSize'
  }
])

const tableHeader8 = ref([
  {
    label: '型体',
    prop: 'style',
    width: '55',
    backgroundColor: ''
  },
  {
    label: '配色',
    prop: 'color',
    width: '55'
  },
  {
    label: '报价日期',
    prop: 'sysDate'
  },
  {
    label: '报价员',
    prop: 'sysUser'
  },
  {
    label: '图片',
    fixed: true,
    prop: 'stylePhoto',
    type: 'img',
    srcList: imgList
  }
])

const tableHeader9 = ref([
  {
    label: '序号',
    prop: 'seqNo',
    width: '55'
  },
  {
    label: '材料类型',
    prop: 'mtlType'
  },
  {
    label: '部位',
    prop: 'partName',
    width: '55'
  },
  {
    label: '材料颜色',
    prop: 'mtlColor'
  },
  {
    label: '材料名称',
    prop: 'mtlName'
  },
  {
    label: '规格',
    prop: 'mtlSpec',
    width: '55'
  },
  {
    label: '单位',
    prop: 'mtlUnit',
    width: '55'
  },
  {
    label: '供应商',
    prop: 'vendor'
  },
  {
    label: '单耗',
    prop: 'stdUsage',
    width: '55'
  },
  {
    label: '中耗',
    prop: 'midUsage',
    width: '55'
  },
  {
    label: '项目类型',
    prop: 'mtlProperty'
  },
  {
    label: '报价单耗',
    prop: 'costUsage',
    width: '55'
  },
  {
    label: '币别',
    prop: 'currency'
  },
  {
    label: '材料单价',
    prop: 'price'
  },
  {
    label: '加工单价',
    prop: 'jgPrice'
  },
  {
    label: '金额',
    prop: 'amt',
    width: '55'
  },
  {
    label: '备注',
    prop: 'remark',
    width: '55'
  }
])

const tableHeader10 = ref([
  {
    label: '名称',
    prop: 'COST_NAME'
  },
  {
    label: '金额(USD)',
    prop: 'AMT'
  }
])

const findClicked = (find: any) => {
  if (find === '置空') {
    clearFormList1()
  }
  if (find === '取型体') {
    sample()
  }
  if (find === '新增报价材料') {
    sample1()
    formList2.value[1].selectOptions = EvaluatesTheArrayReturnValue(['主项', '子项'])
  }
  if (find === '打勾材料删除') {
    if (deleteArray.value.seqNos.length === 0) {
      return JMessage.error('请选择要删除的型体报价资料')
    }
    handleClose3()
  }
  if (find === '打勾型体删除') {
    if (lotNoList2.value.slipNo.length === 0 || lotNoList2.value.style.length === 0) {
      return JMessage.error('请选择要删除的型体资料')
    }
    handleClose4()
  }
  if (find === '打勾记录检核') {
    if (TickRecordCheckParms.value.list.length === 0) {
      JMessage.error('请选择需要打勾的报价型体资料')
      return
    }
    TickRecordCheckParms.value.check = 'Y'
    TickRecordCheck()
  }
  if (find === '打勾取消检核') {
    if (TickRecordCheckParms.value.list.length === 0) {
      JMessage.error('请选择需要打勾的报价型体资料')
      return
    }
    TickRecordCheckParms.value.check = ''
    TickRecordCheck()
  }

  if (find === '更新币别') {
    if (TheNewCurrencyIsDifferentParms.value.seqNos.length === 0) {
      JMessage.warning('请选择需要更新的数据')
    } else if (TheNewCurrencyIsDifferentParms.value.currency === '') {
      JMessage.warning('请选择币别')
    } else {
      TheNewCurrencyIsDifferentMethods()
    }
  }

  if (find === '更新项目类型') {
    if (TheNewCurrencyIsDifferentParms.value.seqNos.length === 0) {
      JMessage.warning('请选择需要更新的数据')
    } else if (TheNewCurrencyIsDifferentParms.value.mtlProperty === '') {
      JMessage.warning('请选择项目类型')
    } else {
      TheNewCurrencyIsDifferentMethods()
    }
  }
  if (find === '搜索') {
    QuoteData()
  }
}

const Launchform = (row: any) => {
  CollectQuotationData.value.style = row[0].inputValue
  CollectQuotationData.value.custom = row[1].selectValue
  CollectQuotationData.value.season = row[2].selectValue
  CollectQuotationData.value.startTime = row[3].dateValue[0]
  CollectQuotationData.value.endTime = row[3].dateValue[1]
  GetTheQuoteTyp.value.mtlProperty = row[15].selectValue
  TheNewCurrencyIsDifferentParms.value.currency = row[19].selectValue
  TheNewCurrencyIsDifferentParms.value.mtlProperty = row[17].selectValue
  if (GetTheQuoteTyp.value.mtlProperty !== '') {
    GetTheQuoteType(GetTheQuoteTyp.value)
    return
  }
  if (row[17].selectValue !== '') {
    return
  }
}

const clickNumber = (row: number) => {
  CollectQuotationData.value.quotation = Number(row)
  QuoteData()
}

const clickNumber1 = (row: number) => {
  CollectQuotationData.value.check = Number(row)
  radio2.value = Number(row)
  QuoteData()
}

const clearFormList1 = () => {
  formList1.value.forEach((item) => {
    if (item.type === 'input') {
      item.inputValue = ''
    } else if (item.type === 'select') {
      item.selectValue = ''
    }
    // Add other conditions for different form item types
  })
}

const checkboxParms = ref<any>()

const checkboxMethods = async () => {
  try {
    const result = await checkbox(checkboxParms.value)
    if (result.code === 200) {
      JMessage.success(result.message)
    } else {
      JMessage.error(result.message)
    }
  } catch (error) {
    JMessage.error('勾选数据时出错')
  }
}

const findClicked1 = (find: any) => {
  if (find === '置空') {
    clearFormList2()
  }
  if (find === '导入勾选') {
    if (lotNoList1.value.quotations.length === 0) {
      JMessage.warning('请勾选需要导入得数据')
    } else {
      fullscreenLoading.value = true
      sampleImportCheck()
    }
  }
}

const Launchform1 = (row: any) => {
  GatherGetTypeData.value.brand = row[0].selectValue
  GatherGetTypeData.value.season = row[1].selectValue
  GatherGetTypeData.value.style = row[2].inputValue
  GatherGetTypeData.value.custStyle = row[4].inputValue
  GatherGetTypeData.value.shoeName = row[3].inputValue
  GetTypeData()
}

const clearFormList2 = () => {
  formList.value.forEach((item) => {
    if (item.type === 'input') {
      item.inputValue = ''
    } else if (item.type === 'select') {
      item.selectValue = ''
    }
    // Add other conditions for different form item types
  })
}

const clearFormList3 = () => {
  formList2.value.forEach((item) => {
    if (item.type === 'input') {
      item.inputValue = ''
    } else if (item.type === 'select') {
      item.selectValue = ''
    }
    // Add other conditions for different form item types
  })
}

const findClicked2 = (find: any) => {
  if (find === '置空') {
    clearFormList3()
  }
  if (find === '保存') {
    const inputValueToCheck = formList2.value[0].inputValue

    // Assuming TableQuoteData.value is an array of objects with 'inputValue' property
    const existingData = DisplayTabularData.value.list.find((item) => item.seqNo === inputValueToCheck)

    if (existingData) {
      return JMessage.error(`${formList2.value[0].inputLabel}已存在`)
    }

    const fieldsToCheck = [formList2.value[0], formList2.value[9], formList2.value[11], formList2.value[12]]

    for (const field of fieldsToCheck) {
      const inputValue = field.inputValue
      if (inputValue === '' || isNaN(Number(inputValue))) {
        return JMessage.error(`${field.inputPlaceholder}不可为空并且必须是数字`)
      }
    }
    fullscreenLoading.value = true
    SaveTheAddType(AddNewQuotationInformation.value as NewQuotationLnformation)
  }
}

const Launchform2 = (row: any) => {
  AddNewQuotationInformation.value.seqNo = row[0].inputValue
  AddNewQuotationInformation.value.mtlType = row[1].selectValue
  AddNewQuotationInformation.value.partName = row[2].inputValue
  AddNewQuotationInformation.value.mtlColor = row[3].inputValue
  AddNewQuotationInformation.value.mtlName = row[4].inputValue
  AddNewQuotationInformation.value.vendor = row[5].inputValue
  AddNewQuotationInformation.value.mtlSpec = row[6].inputValue
  AddNewQuotationInformation.value.mtlUnit = row[7].inputValue
  AddNewQuotationInformation.value.mtlProperty = row[8].selectValue
  AddNewQuotationInformation.value.costUsage = row[9].inputValue
  AddNewQuotationInformation.value.currency = row[10].selectValue
  AddNewQuotationInformation.value.price = row[11].inputValue
  AddNewQuotationInformation.value.jgPrice = row[12].inputValue
}
</script>

<style lang="less" scoped>
// 头部
.header {
  display: flex;
  flex-wrap: wrap;
}

.headerLeft {
  width: 90%;
  margin: auto;
  display: flex;
}

// 中间
.headerMiddle {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
}

// 报价体型
.headerBodily {
  width: 100%;
  box-shadow: none;
}

// 型体基本资料
.headerPhysique {
  width: 100%;
  box-shadow: none;
  margin-left: 10px;
  margin-bottom: 500px;
}

// 报价检核作业
.headerCheck {
  width: 49%;
  margin-left: 10px;
  margin-top: 10px !important;
  box-shadow: none;
}

//报价资料作业
.headerMaterial {
  width: 49%;
  margin-left: 10px;
  margin-top: 10px !important;
  box-shadow: none;
}

// 报价项目明确
.headerProject {
  box-shadow: none;
  margin-left: 10px;
  width: 100%;
}

// 左侧报价型体资料
.MainProject {
  width: 100% !important;
  box-shadow: none;
}

// 选中单选框的背景色
:deep(.is-checked .el-checkbox__inner) {
  background-color: #f89027;
  border: 1px solid #f89027;
}

// 字体颜色
:deep(.is-checked .el-checkbox__label) {
  color: #191919;
}

:deep(.el-icon.el-input__icon.el-range__icon) {
  color: #f89027;
  position: absolute !important;
  right: 6px;
}

:depe(.el-table td.el-table__cell, .el-table th.el-table__cell.is-leaf) {
  color: red !important;
}

// 表格颜色
:deep(.el-table__body-wrapper) {
  font-size: 14px;
}

:deep(.el-table th.el-table__cell > .cell) {
  color: black;
}

:deep(.tab1 .el-table__body .el-table__row:first-child .el-table__cell) {
  padding: 0 !important;
}

:deep(.el-table__body-wrapper .el-table__body .el-table__row > td:first-child) {
  border-left: 1px solid #eaeaea;
  border-right: 1px solid #eaeaea;
}

:deep(.el-table__body-wrapper .el-table__body .el-table__row > td) {
  border-right: 1px solid #eaeaea;
}

// select选择框颜色
:deep(.el-icon svg) {
  color: #191919 !important;
}

:deep(.el-pagination.is-background .el-pager li:not(.is-disabled).is-active) {
  background-color: #f89027;
}

:deep(.footerBottom .el-input) {
  --el-input-focus-border: #fff;
  --el-input-transparent-border: 0 0 0 0px;
  --el-input-border-color: #fff;
  --el-input-hover-border: 0px !important;
  --el-input-hover-border-color: #fff;
  --el-input-focus-border-color: #fff;
  --el-input-clear-hover-color: #fff;
  box-shadow: 0 0 0 0px !important;
  --el-input-border: 0px;
}

:deep(.footerBottom .el-select .el-input__wrapper.is-focus) {
  box-shadow: 0 0 0 0px !important;
}

:deep(.footerBottom .el-select .el-input.is-focus .el-input__wrapper) {
  box-shadow: 0 0 0 0px !important;
}

:deep(.footerBottom .el-select) {
  --el-select-border-color-hover: #fff;
}

// 弹框的样式
.my-header {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

// 纵向滚动条
:deep(.el-scrollbar__bar.is-vertical .el-scrollbar__thumb) {
  opacity: 1;
  width: 6px; // 纵向滑块的宽度
  border-radius: 2px;
  background-color: var(--el-color-primary);
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.15);
}

.el-card {
  margin: 0;
  margin-right: 5px;
}

.el-col {
  border-radius: 4px;
}

.grid-content {
  border-radius: 4px;
}

.el-col {
  border-radius: 4px;
}

.grid-content {
  border-radius: 4px;
}

.el-row:last-child {
  margin-bottom: 0;
}

.el-col {
  border-radius: 4px;
}

.grid-content {
  border-radius: 4px;
}

.MainProject {
  margin-top: 4px;
}

.MainNewly {
  margin-top: 4px;
}

:deep(.el-overlay .el-drawer__header) {
  border: 1px solid;
  margin-bottom: -45px !important;
  background-color: red;
}

:depe(.el-drawer__body) {
  background-color: red;
}

:deep(.el-radio.el-radio--large) {
  height: 23px;
}

:deep(.box-radio) {
  border-radius: 4px;
  /* 设置边框圆角为4px，可根据需要调整 */
  border: 1px solid #c0c4cc;
  /* 设置边框样式 */
  padding: 6px;
  /* 设置内边距，可根据需要调整 */
}

:deep(.el-form-item) {
  margin-bottom: 0 !important;
}

:deep(.picker .el-icon svg) {
  position: absolute;
  right: 6px;
  color: #f89027 !important;
}

h1 {
  font-size: 16px;
}
</style>
